import router, { asyncPermRoutes, constantRoutes } from './router'
import NProgress from 'nprogress' // progress bar
import 'nprogress/nprogress.css' // progress bar style
import getPageTitle from '@/utils/get-page-title'
import store from './store'
import { Message } from 'element-ui'

NProgress.configure({ showSpinner: false }) // NProgress Configuration

// 白名单
const whiteList = ['/login', '/404']

// 全局前置导航守卫
router.beforeEach(async(to, from, next) => {
  // start progress bar
  NProgress.start() // 开启进度条

  const token = store.getters.token
  // set page title
  document.title = getPageTitle(to.meta.title)

  // // 有token 跳转login 拦截到首页
  // if (token && to.path === '/login') {
  //   next('/')
  //   NProgress.done() // 关闭进度条
  //   return
  // }
  // // 有token 跳转非登录页 直接放行
  // if (token && to.path !== '/login') {
  //   next()
  //   NProgress.done() // 关闭进度条
  //   return
  // }
  // // 没有token 跳转白名单直接放行
  // if (!token && whiteList.includes(to.path)) {
  //   next()
  //   NProgress.done() // 关闭进度条
  //   return
  // }
  // // 没有token 跳转非白名单 拦截到登录页 提示用户
  // if (!token && !whiteList.includes(to.path)) {
  //   next('/login')
  //   NProgress.done() // 关闭进度条
  //   Message.info('请先登录')
  //   return
  // }
  // // 注意 需要 手动关闭进度条

  // 优化代码
  if (token) {
    // 跳转的路经是登录页吗？ 是 拦截到首页 不是 直接放行
    to.path === '/login' ? next('/') : next()
    // 有token 没有userId
    !store.getters.userId && await store.dispatch('user/getUserInfoAction')

    // RBAC控制路由
    // 1 拆离静态路由 登录页 注册页 404
    // 2 抽离动态路由数组导出 需要有权限才能看到的页面
    // 在路由守卫中 获取用户能看到的页面数组
    // 动态路由数组 过滤掉 用户能看到的数组 包含动态路由数组的name
    // 使用router.addRoutes 把用户能看到的页面新增进去
    // 注意 addRoutes相当于push 是在数组的最后添加的 所以要把404页面 放在最后面

    // 通过addRoutes添加的路由不具备响应式 所以要把路由存在vuex中
    // state定义变量存放路由数组 mutations定义方法修改路由数组
    // 在路由守卫 过滤后 调用mutations修改路由数组 把静态路由和筛选后用户能看到的路由传进去
    // 把routers 暴露到全局的getters中
    // 在layout/sidebar/index.vue文件中 调用getters

    // 等待获取了用户可以看到的页面信息后 获取页面信息数组
    const menus = store.state.user.userInfo.roles.menus
    const permRoutes = asyncPermRoutes.filter(ele => {
      return menus.includes(ele.name)
    })
    store.commit('user/saveRoutes', [...constantRoutes, ...permRoutes])
    router.addRoutes([...permRoutes, { path: '*', redirect: '/404', hidden: true }])

    NProgress.done() // 关闭进度条
    return
  }
  // 如果没有token 进入下面条件
  if (whiteList.includes(to.path)) {
    // 如果跳转的在白名单上
    next()
    NProgress.done() // 关闭进度条
    return
  } else {
    // 如果不在白名单上
    next('/login')
    NProgress.done() // 关闭进度条
    Message.info('请先登录')
    return
  }
})

router.afterEach(() => {
  // finish progress bar
  NProgress.done() // 关闭进度条
})
